<template>
  <selectPop
    v-model:dialogVisible="visible"
    selectKey="id"
    v-model:selecedList="list"
    :getData="wxUserService.robotAndWxUserList"
    selectTitle="好友"
    title="选择好友"
    type="cate-list"
    cateListChildrenKey="wxUserRelationInfoDtoList"
    v-model:searchParams="searchParams"
    :formItems="formItems"
  >
    <template #cateName="{ item }">
      {{ item.managerName }}
    </template>
    <template #checkboxName="{ item }">
      {{ item.wxUserName }}
      <span v-if="item.realUserName">（{{ item.realUserName }}）</span>
    </template>
    <template #selectName="{ item }">
      <Tooltip
        :text="
          (item.managerName ? item.managerName + '-' : '') + item.wxUserName
        "
      ></Tooltip>
    </template>
  </selectPop>
</template>

<script setup lang="ts">
import selectPop from '@/components/select-pop/index.vue'
import { wxUserService } from '@/api/wxUser'
const props = defineProps({
  dialogVisible: {
    type: Boolean,
  },
  item: {
    type: Object,
  },
  handleSearch: {
    type: Function,
  },
  showManager: {
    type: Boolean,
    default: true,
  },
  title: {
    type: String,
  },
  type: {
    type: Number,
  },
  selecedList: {
    type: Array,
  },
})
const formItems = ref([
  {
    placeholder: '请输入微信昵称',
    key: 'wxUserName',
    type: 'input',
  },
  {
    placeholder: '请输入姓名',
    key: 'realUserName',
    type: 'input',
  },
  {
    placeholder: '请选择标签',
    key: 'tagIds',
    selecedList: [],
    type: 'label',
    tagType: 1, //1：用户标签
  },
])
const visible = ref(props.dialogVisible)
const list = ref(props.selecedList)
const emit = defineEmits(['update:dialogVisible', 'update:selecedList'])

watch(visible, (val) => {
  if (!val) emit('update:selecedList', list.value)
  emit('update:dialogVisible', val)
})
const searchParams = ref({})

onMounted(() => {})
</script>
<style lang="scss" scoped>
.dialog__body {
  display: flex;

  .left {
    width: 650px;
  }

  .right {
    flex: 1;
    width: 0;
    border-left: 1px solid #ccc;
    padding-left: 10px;
  }
}
</style>
